<template>
  <div class="department">
    <pageSearch @query-click="handleQueryClick" @reset-click="handleResetClick" />
    <pageContent ref="contentRef" @new-click="handleNewClick" @edit-click="handleEditBtnClick" />
    <pageModal ref="modalRef" />
  </div>
</template>

<script setup lang="ts" name="department">
import { ref } from 'vue'
import pageSearch from './c-cpns/page-search.vue'
import pageContent from './c-cpns/page-content.vue'
import pageModal from './c-cpns/page-modal.vue'

const contentRef = ref<InstanceType<typeof pageContent>>()
// 查询操作, content 的操作
function handleQueryClick(searchForm: any) {
  contentRef.value?.fetchPageListData(searchForm)
}
// 重置操作
function handleResetClick() {
  contentRef.value?.fetchPageListData()
}
// 点击 content，Modal的操作
const modalRef = ref<InstanceType<typeof pageModal>>()
function handleNewClick() {
  modalRef.value?.setDialogVisible()
}
function handleEditBtnClick(itemData: any) {
  modalRef.value?.setDialogVisible(false, itemData)
}
</script>

<style scoped>
.department {
}
</style>
